
<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="format-detection" content="telephone=no">
    <link rel="shortcut icon" href="${root}images/favicon.ico">
    <link rel="apple-touch-icon-precomposed" href="${root}images/apple-touch-icon.png">
    <title>课程</title>
    <link rel="stylesheet" href="${root}css/seedsui.min.css">
    <style type="text/css">

        .menuwrap-tag:after{
        border-bottom:0px;
        }
    </style>
</head>

<body ontouchstart="">
    <section class="page">
        <header>
            <div class="titlebar">
            <a class="titlebar-button" href="javascript:back()">
            	<img src="${root}img/logo.png" style="width: 24px;height: 24px;" />
            	</a>
            <div class="inputbox bordered" style="margin:0 8px;border-radius: 40px;" data-input="clear">
                <input id="key" style="padding: 2px 8px;" type="search" placeholder="心理直播间" class="search input-text">
                <i id="searchbtn" class="icon size16 icon-search" style="margin-right: 8px;"></i>
            </div>
            <a class="titlebar-button" href="${root}menu">
            	<i class="icon size24 icon-menudot" ></i>
            	</a>
        </div>
        </header>
        <article>
            <div class="menuwrap">
                <div class="menuwrap-side" style="width: 105px;">
                	<div class="menuwrap-tag active " data-css="side">
                        <p class="menuwrap-tag-inner">
                        	全部
                        </p>
                    </div>
                    <!--:for(c in cache.cates!){  -->
                    <div class="menuwrap-tag " data-css="side${cLP.index}">
                        <p class="menuwrap-tag-inner">
                        ${c.name!}
                        </p>
                    </div>
                    <!--:}  -->
                </div>
                <div class="menuwrap-main side " style="display:block" >
                <div style="height: 924px;background-color: white;">
                <br/>
                	<a href="${root}course/" style="padding-top:5px;padding-bottom:5px;margin-left: 5px;margin-right: 5px;" class="button block submit">全部课程</a>
                	
                </div>
                </div>
                <!--:for(c in cache.cates!){  -->
                <div class="menuwrap-main side${cLP.index} " style="display:none;" >
                    <div style="height: 924px;background-color: white;">
                     <a href="${root}course/?cid=${c.id}" style="padding-top:5px;padding-bottom:5px;margin-left: 5px;margin-right: 5px;margin-top: 10px;margin-bottom: 5px;" class="button block submit">全部</a>
                    <ul class="grid" data-col="2">
                    <!--:for(l in c.list!){  -->
			<li>
				<a href="${root}course/?cid=${l.id}" class="grid-icon color-1 size32">
					<i class="icon icon-contact-fill size32"></i>
					</a>
				<label class="grid-label">${l.name!}</label>
			</li>
                  <!--:}  -->
                    </ul>
                    </div>
                </div>
                <!--:}  -->
            </div>
        </article>
        <footer style="position: fixed;left: 0;bottom: 0;">
		<ul class="tabbar tabbar-footer reverse">
            <li class="tab " onclick="location.href='${root}'">
                <i class="icon icon-home"></i>
                <label class="tab-label">首页</label>
            </li>
            <li class="tab active" >
                <i class="icon icon-layer-fill"></i>
                <label class="tab-label">课程</label>
            </li>
            <li class="tab" onclick="location.href='${root}vip/'">
                <img src="${root}img/vip/365.png" style="height: 24px;width: 24px;">
                <label class="tab-label">VIP</label>
            </li>
            <li class="tab" onclick="location.href='${root}zb/'">
                <i class="icon icon-video"></i>
                <label class="tab-label">直播</label>
            </li>
            <li class="tab" onclick="location.href='${root}users/'">
                <i class="icon icon-user"></i>
                <label class="tab-label">我的</label>
            </li>
        </ul>
	</footer>
    </section>
    <script src="${root}assets/third/jquery/jquery-2.1.3.min.js"></script>
    <script src="${root}js/seedsui.min.js"></script>
    
    <script>
    $(function(){
    	$(".menuwrap-tag").click(function(){
    		if(!$(this).hasClass("active")){
    			$(".menuwrap-tag").removeClass("active")
    			$(this).addClass("active")
    			$(".menuwrap-main").css("display","none")
    			$("."+$(this).attr("data-css")).css("display","block")
    		}
    	})
    	
    	$("#searchbtn").on('click', function(){
	        		location.href='${root}course/?key='+$("#key").val();
		        	
	        	})
	     $("#key").on('search', function(){
	    	 location.href='${root}course/?key='+$(this).val();
	        	})
    })
    function back(){history.go(-1);}
</script>
</body>
</html>